import { createResource, createBehavior } from '@inbiz/core';
import MyAutoComplete from './components/MyAutoComplete';
import { EformInput } from './locale';

import {
  createInbizSchema,
  createBaseSchema,
  createValidatorSchema,
  createComponentStyleSchema,
  createDecoratorStyleSchema,
  createModelSchema,
  createSoureSchema,
  getDefalutDecoratorProps,
  createComponentLayout,
  createControllerSchema
} from '@inbiz/setters';
import { Field } from '@formily/core';
import { getPlatform } from '@inbiz/utils';

export const defaultProps = {
  minLength: undefined,
  maxLength: undefined,
  defaultValueType: 'custom',
  systemDefaultValue: 'System_Var_LoginUserID',
  type: 'text',
  defaultValue: undefined,
  placeholder: 'EformInput.placeholder',
  allowClear: true,
  autoComplete: false,
  autoCompleteFiled: '',
  // readOnly:false,
  // disabled:false
  // classPicker:{
  //   categoryType: 0,
  // }
};

export const Schema = createInbizSchema({
  attribute: {
    ...createBaseSchema({
      defaultValueType: {
        type: 'string',
        enum: ['system', 'custom'],
        'x-decorator': 'FormItem',
        'x-component': 'Radio.Group',
        // 'x-component': 'Select',
      },
      systemDefaultValue: {
        type: 'string',
        enum: [
          'System_Var_LoginUserID',
          'System_Var_LoginUserIdentityId',
          'System_Var_LoginUserName',
          'System_Var_LoginUserDeptID',
          'System_Var_LoginUserDeptName',
          'System_Var_LoginUserPostID',
          'System_Var_LoginUserPostName',
          'System_Var_LoginUserAccount',
          // 'System_Var_ParentWindowId',
        ],
        'x-decorator': 'FormItem',
        // 'x-component': 'Radio.Group'
        'x-component': 'Select',
        'x-reactions': {
          dependencies: ['.defaultValueType'],
          fulfill: {
            state: {
              hidden: "{{$deps[0] !== 'system'}}",
              // value:"{{$self.value?$self.value:'System_Var_LoginUserID'}}"
            },
          },
        },
      },
      customValue: {
        type: 'string',
        'x-decorator': 'FormItem',
        'x-component': 'Input',
        'x-reactions': {
          dependencies: ['.defaultValueType'],
          fulfill: {
            state: {
              hidden: "{{$deps[0] !== 'custom'}}",
            },
          },
        },
      },
      placeholder: {
        type: 'string',
        'x-decorator': 'FormItem',
        'x-component': 'MultilingualInput',
        // platform: 'wap',
      },
      type: {
        type: 'string',
        enum: ['text', 'password'],
        'x-decorator': 'FormItem',
        // 'x-component': 'Radio.Group'
        'x-component': 'Select',
        'x-reactions': {
          dependencies: ['.autoComplete'],
          fulfill: {
            state: {
              // visible: '{{$deps[0] == false}}',
              value: '{{$deps[0] == true?"text":$self.value}}',
            },
            schema: {
              enum: "{{$deps[0] ? ['text'] : ['text', 'password']}}",
              // 'x-disabled':"{{$deps[0] ? true : false}}"
            },
          },
        },
      },
      // classPicker: {
      //   type: 'string',
      //   'x-decorator': 'FormItem',
      //   'x-component': 'ClassPicker',
      // },
      addonAfter: {
        type: 'string',
        'x-decorator': 'FormItem',
        'x-component': 'Input',
      },
      autoComplete: {
        type: 'boolean',
        enum: [true, false],
        'x-decorator': 'FormItem',
        'x-component': 'Select',
      },
      autoCompleteFiled: {
        type: 'string',
        'x-decorator': 'FormItem',
        'x-component': MyAutoComplete,
        'x-reactions': {
          dependencies: ['.autoComplete', 'form.senior.soure.sourceModelUpdate'],
          fulfill: {
            state: {
              visible: '{{$deps[0] == true}}',
            },
            schema: {
              //@ts-ignore
              'x-component-props.update': '{{$deps[1]}}',
            },
          },
        },
      },

      allowClear: {
        type: 'boolean',
        'x-decorator': 'FormItem',
        'x-component': 'Switch',
      },
    }),
    ...createValidatorSchema(true, {
      minLength: {
        type: 'number',
        'x-decorator': 'FormItem',
        'x-component-props': {
          min: 2,
          precision: 0,
        },
        'x-component': 'NumberPicker',
        'x-reactions': {
            dependencies: ['.maxLength'],
            fulfill: {
              run:`$deps[0] && $self.value && $self.value > $deps[0]&&$form.setValuesIn('.minLength', null)`
              // state: {
              //   selfErrors:
              //     '{{$deps[0] && $self.value && $self.value > $deps[0] ? "最小字数不能大于最大字数" : ""}}',
              // },
            },
          }
      },
      maxLength: {
        type: 'number',
        'x-decorator': 'FormItem',
        'x-component-props': {
          min: 1,
          precision: 0,
        },
        'x-component': 'NumberPicker',
        'x-reactions': {
          dependencies: ['.minLength'],
          fulfill: {
            run:`$deps[0] && $self.value && $self.value < $deps[0] &&$form.setValuesIn('.maxLength', null)`
            // state: {
            //   selfErrors:
            //     '{{$deps[0] && $self.value && $self.value < $deps[0] ? "最大字数不能小于最小字数" : ""}}',
            // },
          },
        }
      },
    }),
  },
  style: {
    ...createComponentStyleSchema(),
    ...createComponentLayout(),
    ...createDecoratorStyleSchema(),
  },
  senior:
  {
    ...createModelSchema(),
    ...createSoureSchema({
      fieldChange: (form, value) => {
        const autoCompleteFiled = form.query(/autoCompleteFiled$/).take() as Field;
        let modelName;
        const list = value?.queryField?.map((item) => {
          if (item.Master) {
            modelName = item.ModelName;
          }
          return item.AnotherName ? item.AnotherName : item.FieldName.split('$')[1];
        });
        if (list?.indexOf(autoCompleteFiled.value) === -1) {
          autoCompleteFiled.value = '';
        }
      },
    }),
  },

  controller:createControllerSchema({
    events: [
    {
      name: 'onChange',
      label: '数据变更'
    },
    {
      name:'onSearch',
      label:'搜索',
      platform:'web'
    },
    {
      name:'onSelect',
      label:'选择',
      platform:'web'
    },
    {
      name: 'onRequest',
      label: '自定义请求',
      platform:'web',
      isConfigEvent:true
    },
    {
      name: 'onData',
      label: '格式化数据',
      platform:'web',
      isConfigEvent:true
    }
  ],
  })
});

export const Resource = createResource({
  icon: 'Input',
  elements: [
    {
      componentName: 'Field',
      props: {
        type: 'string',
        title: {
          value: 'EformInput.title',
          status: true,
        },
        'x-decorator': 'FormItem', //FormItemVertical
        'x-component': 'EformInput',
        'x-component-props': defaultProps,
        'x-decorator-props': getDefalutDecoratorProps(getPlatform()),
      },
    },
  ],
});

export const Behavior = createBehavior({
  name: 'EformInput',
  extends: ['Field'],
  selector: (node) => node.props?.['x-component'] === 'EformInput',
  designerProps: { propsSchema: Schema },
  designerLocales: EformInput,
});
